<template>
    <div class="amap-page-container">
      <el-amap vid="container2" class="amap-demo" >
      </el-amap>
		<button class="cu-btn bg-olive"  @click="onComplete()">继续动画</button>
		<button class="cu-btn bg-red"  @click="stopAnimation()">停止动画</button>
      <div class="toolbar">
        <span v-if="loaded">
          location: lng = {{ lng }} lat = {{ lat }}
        </span>
        <span v-else>正在定位</span>
      </div>
    </div>
  </template>
<!-- <script src="//webapi.amap.com/ui/1.0/main.js?v=1.0.11"></script> -->
<script>
		// import 'amap/main.js';
	// import {
	// 	AMapManager,
	// 	lazyAMapApiLoaderInstance
	// } from 'vue-amap';
	// VueAMap.initAMapApiLoader({
	// 	//高德KEY
	//   key: '0c84208de6aaff3252ba3f7cd1d2a6c8',
	//   //插件集合
	//   plugin: ['AMap.Autocomplete', 'AMap.PlaceSearch', 'AMap.Scale', 'AMap.OverView', 'AMap.ToolBar', 'AMap.MapType', 'AMap.PolyEditor', 'AMap.CircleEditor'],
	//    uiVersion: '1.0', // ui库版本，不配置不加载,
	//   // 默认高德 sdk 版本为 1.4.4
	//   v: '1.4.4'
	// });
	export default {
		data() {
			 let self = this;
			return {
				map:null,
				}
			},
		onload() {
		
		 this.map = new AMap.Map('container2',{
		            resizeEnable: true,
		            zoom: 24,
		            center: [116.480983, 40.0958]
		        });
		
		        map.plugin('AMap.Geolocation', function () {
		            geolocation = new AMap.Geolocation({
		                enableHighAccuracy: true,//是否使用高精度定位，默认:true
		                timeout: 10000,          //超过10秒后停止定位，默认：无穷大
		                maximumAge: 0,           //定位结果缓存0毫秒，默认：0
		                convert: true,           //自动偏移坐标，偏移后的坐标为高德坐标，默认：true
		                showButton: true,        //显示定位按钮，默认：true
		                buttonPosition: 'LB',    //定位按钮停靠位置，默认：'LB'，左下角
		                buttonOffset: new AMap.Pixel(10, 20),//定位按钮与设置的停靠位置的偏移量，默认：Pixel(10, 20)
		                showMarker: true,        //定位成功后在定位到的位置显示点标记，默认：true
		                showCircle: true,        //定位成功后用圆圈表示定位精度范围，默认：true
		                panToLocation: true,     //定位成功后将定位到的位置作为地图中心点，默认：true
		                zoomToAccuracy:true      //定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：false
		            });
		
		    map.addControl(geolocation);
		    AMap.event.addListener(geolocation, 'complete2', onComplete);//返回定位信息
		    AMap.event.addListener(geolocation, 'error', onError);      //返回定位出错信息
		});
    },
		methods:{
			//  onComplete(obj){
			//    console.log(obj.message);
			// },
					
			//   onError(obj){
			//   console.log(obj.message);
			// }     
		}
}
</script>

<style>
   .amap-demo {
      height: 300px;
    }
</style>
